import { UiButton } from "@/shared/Uikit";
import { UiSelectField } from "@/shared/Uikit/UiSelectField";
import { UiTextField } from "@/shared/Uikit/UiTextField";
import { useGetCurrentUser } from "@/entities/user/model/useGetCurrentUser";
import { useCreateTheme } from "../model/useCreateTheme";
import { useGetAllDisciplines } from "@/entities/discipline/model/useGetAllDisciplines";
import { useEffect } from "react";


export default function UiCreateTheme(props: { disciplineId: number, level: number, onSuccess: () => void }) {
    const { register, handleSubmit, errorMessage, isSuccess } = useCreateTheme(props.disciplineId, props.level)
    const { user } = useGetCurrentUser();
    const { disciplines } = useGetAllDisciplines()
    useEffect(() => {
        if (props.onSuccess && isSuccess)
            props.onSuccess()
    }, [isSuccess])

    return (
        <div className='flex flex-col gap-4'>
            <h1 className='font-bold text-lg'>Создание темы:</h1>
            <form className="flex flex-col gap-2" onSubmit={handleSubmit}>
                <UiTextField
                    label="Название"
                    inputProps={{
                        type: "text",
                        placeholder: "Название...",
                        ...register("tittle", { required: true })
                    }}
                />
                <UiTextField
                    label="Количество награды за прохождение"
                    inputProps={{
                        type: "number",
                        placeholder: "300",
                        ...register("award", { required: true })
                    }}
                />

                <UiButton variant="primary">
                    Создать тему
                </UiButton>
                {errorMessage && <div className="text-rose-500">{errorMessage}</div>}
                {isSuccess && <div className="text-green-500">Успешно!</div>}
            </form>
        </div>
    )
}